<template>
  <div>
    <el-dialog
      title="添加规则"
      :visible.sync="ruleDialogVisible"
      width="700px"
      class="gl_dialog_TitleLine gl_dl_footer"
      :close-on-click-modal="false"
    >
      <div v-loading="loading" class="gl_px_20">
        <el-form ref="selectedMsg" :model="selectedMsg" :rules="selectedMsg_rules">
          <el-form-item prop="title">
            <div>
              <p class="gl_fs_16 gl_mb_5 gl_ft_weight">人气榜标题</p>
              <el-input v-model="selectedMsg.title" maxlength="30" type="text" placeholder="请输入" />
            </div>
          </el-form-item>
          <el-form-item prop="content">
            <div>
              <p class="gl_fs_16 gl_mb_5 gl_ft_weight">人气榜规则</p>
              <Tinymce v-model="selectedMsg.content" :height="300" />
            </div>
          </el-form-item>
        </el-form>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button size="medium" @click="ruleDialogVisible = false">取 消</el-button>
        <el-button :loading="buLoading" size="medium" type="primary" @click="confirmDialog">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import Tinymce from '@/components/Tinymce';
import {
  api_POST_EventsManagementVotingRegulationVotingRegulation,
  api_GET_EventsManagementVotingRegulationVotingRegulation
} from '@/extend/api/gameswaggerApi/app';
import { SiSTKWEventsManagementVotingRegulationInput } from '@/lib/form/game/swaggerForm';
export default {
  components: {
    Tinymce
  },
  data() {
    return {
      loading: false,
      buLoading: false,
      selectedMsg_rules: {
        title: [{ required: true, message: '标题不能为空', trigger: 'blur' }],
        content: [{ required: true, message: '内容不能为空', trigger: 'blur' }]
      },
      ruleDialogVisible: false,
      selectedMsg: new SiSTKWEventsManagementVotingRegulationInput()
    };
  },
  methods: {
    getList() {
      this.loading = true;
      api_GET_EventsManagementVotingRegulationVotingRegulation().then(res => {
        this.loading = false;
        if (res && res.title) {
          this.selectedMsg.title = res.title;
          this.selectedMsg.content = res.content;
        }
      }, error => {
        this.loading = false;
        const _msg = error.error.message || error.message;
        this.$message({ type: 'error', message: _msg });
      });
    },
    confirmDialog() {
      this.$refs.selectedMsg.validate(valid => {
        if (!valid) return;
        this.loading = true;
        this.buLoading = true;
        api_POST_EventsManagementVotingRegulationVotingRegulation(this.selectedMsg).then(res => {
          this.buLoading = false;
          this.loading = false;
          if (res) {
            this.$message({ type: 'success', message: '添加成功' });
          }
          this.ruleDialogVisible = false;
          this.selectedMsg = new SiSTKWEventsManagementVotingRegulationInput();
        }, error => {
          this.buLoading = false;
          this.loading = false;
          const _msg = error.error.message || error.message;
          this.$message({ type: 'error', message: _msg });
        });
      });
    }
  }
};
</script>

<style lang="scss" scoped>
</style>
